<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html
	xmlns="http://www.w3.org/1999/xhtml"
	xml:lang="en"
	lang="en">

<head>

<meta
	http-equiv="Content-Type"
	content="text/html; charset=utf-8" />
<script
	type="text/javascript"
	src="http://code.jquery.com/jquery.min.js"></script>
<script src="lightbox/js/lightbox.js"></script>
<link
	href="lightbox/css/lightbox.css"
	rel="stylesheet" />
<link
	rel="shortcut icon"
	href="favicon.ico"
	type="image/x-icon" />
<link
	rel="icon"
	href="favicon.ico"
	type="image/x-icon" />

<title>friendizer</title>

<style type="text/css">
* {
	margin: 0;
	padding: 0;
}

body {
	font: 16px Helvetica, Sans-Serif;
	line-height: 24px;
	background: url(noise.jpg);
}

.clear {
	clear: both;
}

#page-wrap {
	width: 800px;
	margin: 40px auto 60px;
}

#pic {
	float: right;
	margin: 20px 0 0 0;
}

p {
	margin: 0 0 16px 0;
}

.text_link {
	color: #999;
	text-decoration: none;
	border-bottom: 1px dotted #999;
}

.text_link:hover {
	border-bottom-style: solid;
	color: black;
}

#objective {
	width: 500px;
	float: left;
}

#objective p {
	font-family: Georgia, Serif;
	font-style: italic;
	color: #666;
}

.thumb {
	height: 100px;
	width: 100px;
}

.thumbnails a {
	margin: 4px;
}

.thumbnails a img {
	border: solid 1px #aaa;
}

.thumbnails a:hover img {
	border: solid 1px Black;
}
</style>

<script type="text/javascript">
	var _gaq = _gaq || [];
	_gaq.push([ '_setAccount', 'UA-30423343-2' ]);
	_gaq.push([ '_trackPageview' ]);

	(function() {
		var ga = document.createElement('script');
		ga.type = 'text/javascript';
		ga.async = true;
		ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
		var s = document.getElementsByTagName('script')[0];
		s.parentNode.insertBefore(ga, s);
	})();
</script>

</head>

<body>
	<div id="page-wrap">

		<div>
			<img
				id="logo"
				alt="friendizer logo"
				src="friendizer-black-no-bg.png"></img>
			<div
				id="menu"
				style="position: fixed; top: 1%; right: 1%;">
				<a
					class="text_link"
					href="mailto:friendizer.info@gmail.com">Contact Us</a>
			</div>
			<!-- <h1 class="fn">friendizer</h1> -->

			<div
				id="pic"
				class="thumbnails">
				<a
					href="screenshots/my_profile.png"
					rel="lightbox[ss]"><img
					src="screenshots/my_profile_thumb.png"
					alt="Profile"
					class="thumb" /></a> <a
					href="screenshots/achievements.png"
					rel="lightbox[ss]"><img
					src="screenshots/achievements_thumb.png"
					alt="Achievements"
					class="thumb" /></a> <br /> <a
					href="screenshots/chat.png"
					rel="lightbox[ss]"><img
					src="screenshots/chat_thumb.png"
					alt="Chat"
					class="thumb" /></a><a
					href="screenshots/map.png"
					rel="lightbox[ss]"><img
					src="screenshots/map_thumb.png"
					alt="People Radar"
					class="thumb" /></a> <br /> <a
					href="screenshots/gifts.png"
					rel="lightbox[ss]"><img
					src="screenshots/gifts_thumb.png"
					alt="Chat"
					class="thumb" /></a><a
					href="screenshots/mutual_likes.png"
					rel="lightbox[ss]"><img
					src="screenshots/mutual_likes_thumb.png"
					alt="People Radar"
					class="thumb" /></a><br /> <a href="https://play.google.com/store/apps/details?id=com.teamagly.friendizer"><img
					src="http://chart.apis.google.com/chart?cht=qr&chs=210x210&chl=https%3A//play.google.com/store/apps/details%3Fid%3Dcom.teamagly.friendizer&chld=H|0"
					alt="QR Code"
					title="Scan to download" /></a> <br /> <a href="https://play.google.com/store/apps/details?id=com.teamagly.friendizer"><img
					id="brought-to-you"
					src="http://www.android.com/images/brand/get_it_on_play_logo_large.png"
					style="border: none; padding-left: 20px; padding-top: 5px"></img></a>
			</div>
			<br /> <br /> <br />
		</div>

		<div id="objective">
			<p>
				<i>friendizer<i> is a competitive social game based on location that offers an opportunity to meet new people with common interests.<br>
<i>friendizer<i> lets you know when your friends or other interesting people are around.
			</p>
			<iframe
				width="500"
				height="281"
				src="http://www.youtube.com/embed/RsTySc1xXYk?rel=0&wmode=transparent&hd=1"
				frameborder="0"
				allowfullscreen></iframe>
			<br /><br />
			<div
				class="fb-like"
				data-href="http://www.facebook.com/friendizer"
				data-send="true"
				data-width="500"
				data-show-faces="true"></div>
		</div>

		<div class="clear"></div>
		<img
			src="icon.png"
			style="position: fixed; top: 40%; right: 70%; width: 680px; height: 680px; z-index: -1;" />
		<div
			style="position: fixed; bottom: 1%; left: 90%; font-size: small; color: gray;"
			onclick="changeTheme()">
			<a
				href="#"
				class="text_link">switch theme</a>
		</div>
	</div>

	<div id="fb-root"></div>

	<!-- Facebook Javascript SDK -->
	<script>
		(function(d, s, id) {
			var js, fjs = d.getElementsByTagName(s)[0];
			if (d.getElementById(id))
				return;
			js = d.createElement(s);
			js.id = id;
			js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=273844699335189";
			fjs.parentNode.insertBefore(js, fjs);
		}(document, 'script', 'facebook-jssdk'));
	</script>

	<script type="text/javascript">
		function changeTheme() {
			if ($('#logo').attr("src") == "friendizer-black-no-bg.png") {
				// Change to dark theme
				$('#logo').attr("src", "friendizer-white-no-bg.png");
				$("body").css("background", "url('black-noise.png')");
				$("a").hover(function() {
					$(this).css('color', 'white');
				}, function() {
					$(this).css('color', '#999');
				});
				$("#brought-to-you").hide();
			} else {
				// Change to light theme
				$('#logo').attr("src", "friendizer-black-no-bg.png");
				$("body").css("background", "url('noise.jpg')");
				$("a").hover(function() {
					$(this).css('color', 'black');
				}, function() {
					$(this).css('color', '#999');
				});
				$("#brought-to-you").show();
			}
		}
	</script>

</body>

</html>